<script type="text/javascript">
    jQuery(document).ready(function(){    
        jQuery(".loadPage").click(function(e){ 
            jQuery("#profilePageContent").html('<div id="loader"></div>');
            jQuery(".tabbing li").removeClass("current");
            jQuery(this).parent().addClass("current");
            e.preventDefault();
            url=this.href;            
            jQuery("#profilePageContent").load(url, function() {                
                jQuery("#loader").remove();
            });            
        }); 
        
         jQuery(".loadComment").click(function(e){ 
            jQuery("#profile_comment_load").html('<div id="loader"></div>');
            jQuery(".tabbing li").removeClass("current");
            jQuery(this).parent().addClass("current");
            e.preventDefault();
            url=this.href;            
            jQuery("#profile_comment_load").load(url, function() {                
                jQuery("#loader").remove();
            });
            
        }); 
    }); 
</script>


<?php
echo $this->Html->script(array('jNice', 'fileuploader'));
echo $this->element("scroll_element", array("cache" => true));
?>

<!--sidebar-->
<div class="sidebar"> 
    <div class="profile-thumb">
        <?php
        if ($session->read('Auth.User.profile_image') == "")
            echo $facebook->picture($session->read('Auth.User.facebook_id'), array('size' => 'normal', 'width' => '175', 'height' => '164'));
        else {
            echo $this->Html->link(
                    $this->Html->image('profile_images/' . $session->read('Auth.User.profile_image'), array('alt' => $session->read('Auth.User.name'), 'width' => '175', 'height' => '164')), array('controller' => 'users', 'action' => 'profile'), array('escape' => false));
        }
        ?>
    </div>
    <h3 class="sidebar-title">actions</h3>
    <?php  echo $this->element("left_action_menu", array("cache" => true)); ?>
    <!--Friend list-->
    <?php echo $this->element("profile_friend_list", array("cache" => true)); ?>
    <!-- /Friend list-->
</div>
<!--/sidebar--> 

<!--right panel-->
<div class="right-panel">
    <!--Top Panel-->
    <div class="toppanel">
        <div class="top-round">
            <div class="box-y-rptr">
                <div class="box-content"> 
                    <!--tabbing-->
                    <?php
                    echo $this->element("profile_tab_menu", array("cache" => true));
                    ?>                    
                    <!--/tabbing-->
                    <div id="profilePageContent">
                        <div class="vedio-content scroll-pane" style="height:370px; width:936px;display:none; ">
                            <div class="video-player">

                            </div>
                            <div class="video-info">
                                <h3><?php echo $session->read('Auth.User.name'); ?></h3>
                                <?php echo $session->read('Auth.User.url'); ?><br />
                                <?php echo $session->read('Auth.User.location'); ?></div>
                            <div class="video-info large-gap">
                                <h3>FOCUS AREAS</h3>
                               <?php                         
                        foreach($user_areas as $val){
                           echo $val['FocusArea']['focus_area']."<br />";
                        }
                        ?></div>
                            <div class="video-info no-gap">
                                <h3>MISSION</h3>
                                <?php echo $session->read('Auth.User.mission'); ?>
                            </div>
                            <div class="clear"></div>
                        </div>
                          <!--PROFILE VIEW-->
                          <div class="graph-block" style="display:block;">
                             <div class="profileview">
                             <div style="width:950px;">
                             <form action="#" class="jNice">
                                <div class="padder">
                                        <div class="formBlock">
                                            <div class="genInfo">
                                               
                                                
                                                <h2><?php echo $session->read('Auth.User.name'); ?></h2>
                                                <?php echo $session->read('Auth.User.gender'); ?><br />
                                                <?php echo $currentAge; ?> years old<br />
                                                <?php echo $session->read('Auth.User.location'); ?>
                                         
                                            </div>
                                            <div class="uploadImg inspire">
                                                <h3 class="chooseLabel">profile image</h3>
                                                <div class="globalButtons"><span><span>CHOOSE</span></span></div>
                                            </div>
                                            <div class="clear"></div>
                                            <div class="vision">
                                                <h3 class="profileLabel">MISSION</h3>
                                                <div class="textAreaWrapper">
                                                    <div class="textAreaRight">
                                                        <div class="textAreaRptr">
                                                            <div class="textScroller" style="height:93px; width:853px;"><textarea rows="" cols=""> <?php echo $session->read('Auth.User.mission'); ?></textarea></div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <h3 class="profileLabel">FOCUS AREAS</h3>
                                                <div class="checkBoxes">                                                    
                                                     <?php                        
                                                        foreach ($focus_areas as $key => $val) { //pr($focus_areas);
                                                            $checked = "";
                                                            foreach($user_areas as $res){
                                                                if($val==$res['FocusArea']['focus_area']){
                                                                     $checked = ' checked="checked"';
                                                                  }
                                                                 }
                                                                echo $this->Form->checkbox('User.focus_area_id', array('name' => 'data[User][focus_area_id][]', 'value' => $key,'checked'=> $checked, 'hiddenField' => FALSE)); 
              
                                                      ?>
                                                    <label><?php echo $val; ?></label>

<!--                                                          <input type="checkbox" name="data[User][focus_area_id][]" value="<?php echo $key; ?>" <?php echo $checked; ?> /><label><?php echo $val; ?></label>-->
                                                        <?php } ?>     

                                                       <label generated="true" class="focusArea error" style="display: none"></label>
                                                    <div class="clear">&nbsp;</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                             </form>
                             </div>
                             </div>
                           </div>
                          <!--/PROFILE VIEW-->
                    </div>

                </div>
            </div>
        </div>
    </div>
    <!--/Top Panel-->

    <!--Bottom Panel-->
    <div class="bottom-panel">
        <div class="bottom-panel-in">
            <div class="bottom-y">
                <div class="bottom-content">
                    <!--tabbing-->
                    <?php
                    echo $this->element("profile_comments_tab_menu", array("cache" => true));
                    ?>                    
                    <!--/tabbing-->
                    <div id="profile_comment_load">
                    <div class="scroll-pane bottom-scroll">
                        <ul class="comment-list">

                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                            <li>
                                <a href="#" class="comm-thumb"><img src="images/no-thumb.jpg" alt="" width="49" height="46" /></a>
                                <h3 class="comm-hints">Lorem ipsum dolor sit amet</h3>
                                <a href="#" class="comm-link">comment</a>
                                <a href="#" class="user-id">jido: adam ruskin</a>
                            </li>
                        </ul>
                    </div>
                   </div> 
                </div>
            </div>
        </div>
    </div>
    <!--/Bottom Panel-->

</div>
<!--/right panel-->
<div class="clear"></div>
<!--stats-->
<?php
echo $this->element("profile_suggested_programs", array("cache" => true));
?>  
<!--/stats-->
</div>